import React from 'react';
import { connect } from 'umi';
import { Modal, Button, Form, Input, Checkbox, Select, InputNumber, DatePicker } from 'antd';
import moment from 'moment';


class CommentProductModal extends React.Component {
  constructor(props) {
    super(props);
    this.form = null;
    this.state = {
      submitBtnLoading: false,
    }
  }
  formRef = React.createRef();

  // handle
  onSubmit = () => {
    this.formRef.current.validateFields()
      .then(async values => {
        const payload = {
          transaction_md5: this.props.modalDetail?.transaction_md5,
          comment: values.comment
        };
        await this.props.dispatch({type: 'commonModel/editProductList', payload: payload});
        await this.props.hide();

      })
      .catch(errorInfo => {
        console.log(errorInfo)
      });
  };

  handleCancelBtnClick = async () => {
    this.props.hide()
  };

  // life cycle
  initData = async () => {

  };

  componentWillMount() {
    this.initData().then(()=>null)
  }

  render() {

    return (

      <div>
        <Modal
          title="订单评论"
          visible={this.props.visible}
          onOk={this.onSubmit}
          onCancel={this.handleCancelBtnClick}
        >
          <Form
            labelCol={{span: 6}}
            wrapperCol={{span: 16}}
            ref={this.formRef}
            name="control-ref"
            initialValues={{
              // transaction_md5:this.props.order?.transaction_md5
            }}
            onFinish={this.onFinish}
          >

            <Form.Item
              label="订单号"
              // name="transaction_md5"
            >
              <Input placeholder="订单号" type='text' value={this.props.modalDetail?.transaction_md5} disabled/>
            </Form.Item>

            <Form.Item
                label="店铺"
                // name="offer_username"
            >
              <Input placeholder="店铺" value={this.props.modalDetail?.offer_username} disabled/>
            </Form.Item>

            <Form.Item
                label="饮用水名称"
                // name="machine_name"
            >
              <Input placeholder="饮用水名称" value={this.props.modalDetail?.machine_name} disabled/>
            </Form.Item>

            <Form.Item
                label="评论"
                name="comment"
            >
              <Input.TextArea rows={3} placeholder="评论"  defaultValue={this.props.modalDetail?.comment}/>
            </Form.Item>


          </Form>
        </Modal>
      </div>
    )
  }


}

function mapStateToProps({ loginModel, commonModel }) {
  const { isLogin, username, user_role } = loginModel;
  const { machineInfo, city_list,editProductList } = commonModel;
  return { isLogin, username, user_role, machineInfo, city_list,editProductList };
}

export default connect(mapStateToProps)(CommentProductModal);
